<template>
    <div class="">

        list 组件


        <h1> {{ age }}</h1>


        <div>

            {{ name }}-----{{ id }}-------{{ age }}
        </div>

    </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import { reactive, toRefs, ref, onMounted, watch } from "vue"

import { useRoute, useRouter } from 'vue-router'





export default {
    props: ['age', 'name', 'id'],
    name: "",
    //import引入的组件需要注入到对象中才能使用
    components: {},
    //这里存放数据
    setup (props) {

        const route = useRoute()
        const router = useRouter()

        console.log(route.params);


        console.log(props);


        watch(() => route.path, (newRoute, oldRoute) => {

            console.log('newRoute', newRoute);
            console.log('oldRoute', oldRoute);
            if (newRoute == '/home') {
                alert('首页欢迎你')
                setTimeout(() => {
                    router.push('/news/100')
                }, 2000)
            }
        }, {
            immediate: true
        })



        return {

        }
    }
}
</script>

<style lang="css" scoped>
</style>
